<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
<meta name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">

    <meta name="author" content="ZhangPing">





<title>登录和第三⽅授权 | ZhangPing&#39;s Blog</title>



    <link rel="icon" href="/favicon.ico">




    <!-- stylesheets list from _config.yml -->
    
    <link rel="stylesheet" href="/css/style.css">
    



    <!-- scripts list from _config.yml -->
    
    <script src="/js/script.js"></script>
    
    <script src="/js/tocbot.min.js"></script>
    



    
    
        
    


<meta name="generator" content="Hexo 4.2.0"></head>
<body>
    <div class="wrapper">
        <header>
    <nav class="navbar">
        <div class="container">
            <div class="navbar-header header-logo"><a href="/">ZhangPing&#39;s Blog</a></div>
            <div class="menu navbar-right">
                
                    <a class="menu-item" href="/archives">Posts</a>
                
                    <a class="menu-item" href="/category">Categories</a>
                
                    <a class="menu-item" href="/tag">Tags</a>
                
                    <a class="menu-item" href="/about">About</a>
                
                <input id="switch_default" type="checkbox" class="switch_default">
                <label for="switch_default" class="toggleBtn"></label>
            </div>
        </div>
    </nav>

    
    <nav class="navbar-mobile" id="nav-mobile">
        <div class="container">
            <div class="navbar-header">
                <div>
                    <a href="/">ZhangPing&#39;s Blog</a><a id="mobile-toggle-theme">·&nbsp;Light</a>
                </div>
                <div class="menu-toggle" onclick="mobileBtn()">&#9776; Menu</div>
            </div>
            <div class="menu" id="mobile-menu">
                
                    <a class="menu-item" href="/archives">Posts</a>
                
                    <a class="menu-item" href="/category">Categories</a>
                
                    <a class="menu-item" href="/tag">Tags</a>
                
                    <a class="menu-item" href="/about">About</a>
                
            </div>
        </div>
    </nav>

</header>
<script>
    var mobileBtn = function f() {
        var toggleMenu = document.getElementsByClassName("menu-toggle")[0];
        var mobileMenu = document.getElementById("mobile-menu");
        if(toggleMenu.classList.contains("active")){
           toggleMenu.classList.remove("active")
            mobileMenu.classList.remove("active")
        }else{
            toggleMenu.classList.add("active")
            mobileMenu.classList.add("active")
        }
    }
</script>
        <div class="main">
            <div class="container">
    
    
        <div class="post-toc">
    <div class="tocbot-list">
    </div>
    <div class="tocbot-list-menu">
        <a class="tocbot-toc-expand" onclick="expand_toc()">Expand all</a>
        <a onclick="go_top()">Back to top</a>
        <a onclick="go_bottom()">Go to bottom</a>
    </div>
</div>

<script>
    document.ready(
        function () {
            tocbot.init({
                tocSelector: '.tocbot-list',
                contentSelector: '.post-content',
                headingSelector: 'h1, h2, h3, h4, h5',
                collapseDepth: 1,
                orderedList: false,
                scrollSmooth: true,
            })
        }
    )

    function expand_toc() {
        var b = document.querySelector(".tocbot-toc-expand");
        tocbot.init({
            tocSelector: '.tocbot-list',
            contentSelector: '.post-content',
            headingSelector: 'h1, h2, h3, h4, h5',
            collapseDepth: 6,
            orderedList: false,
            scrollSmooth: true,
        });
        b.setAttribute("onclick", "collapse_toc()");
        b.innerHTML = "Collapse all"
    }

    function collapse_toc() {
        var b = document.querySelector(".tocbot-toc-expand");
        tocbot.init({
            tocSelector: '.tocbot-list',
            contentSelector: '.post-content',
            headingSelector: 'h1, h2, h3, h4, h5',
            collapseDepth: 1,
            orderedList: false,
            scrollSmooth: true,
        });
        b.setAttribute("onclick", "expand_toc()");
        b.innerHTML = "Expand all"
    }

    function go_top() {
        window.scrollTo(0, 0);
    }

    function go_bottom() {
        window.scrollTo(0, document.body.scrollHeight);
    }

</script>
    

    
    <article class="post-wrap">
        <header class="post-header">
            <h1 class="post-title">登录和第三⽅授权</h1>
            
                <div class="post-meta">
                    
                        Author: <a itemprop="author" rel="author" href="/">ZhangPing</a>
                    

                    
                        <span class="post-time">
                        Date: <a href="#">January 15, 2021&nbsp;&nbsp;0:00:00</a>
                        </span>
                    
                    
                        <span class="post-category">
                    Category:
                            
                                <a href="/categories/%E7%AC%94%E8%AE%B0/">笔记</a>
                            
                        </span>
                    
                </div>
            
        </header>

        <div class="post-content">
            <h2 id="登录和授权的区别"><a href="#登录和授权的区别" class="headerlink" title="登录和授权的区别"></a>登录和授权的区别</h2><ul>
<li>登录：身份认证，即确认「你是你」的过程。</li>
<li>授权：由身份或持有的令牌确认享有某些权限（例如获取⽤户信息）。⽽登录过程实质上的⽬的也是为了确认权限。</li>
</ul>
<p>因此，在实际的应⽤中，多数场景下的「登录」和「授权」界限是模糊的。</p>
<h2 id="HTTP-中确认授权（或登录）的两种⽅式"><a href="#HTTP-中确认授权（或登录）的两种⽅式" class="headerlink" title="HTTP 中确认授权（或登录）的两种⽅式"></a>HTTP 中确认授权（或登录）的两种⽅式</h2><ol>
<li>通过 Cookie</li>
<li>通过 Authorization Header</li>
</ol>
<h2 id="Cookie"><a href="#Cookie" class="headerlink" title="Cookie"></a>Cookie</h2><ul>
<li><p>起源：「购物⻋」功能的需求，由 Netscape 浏览器开发团队打造。</p>
</li>
<li><p>⼯作机制：</p>
<ol>
<li><p>服务器需要客户端保存的内容，放在 Set-Cookie headers ⾥返回，客户端会⾃动保存。</p>
</li>
<li><p>客户端保存的 Cookies，会在之后的所有请求⾥都携带进 Cookie header⾥发回给服务器。</p>
</li>
<li><p>客户端保存 Cookie 是按照服务器域名来分类的，例如 shop.com 发回的Cookie 保存下来以后，在之后向 games.com 的请求中并不会携带。</p>
</li>
<li><p>客户端保存的 Cookie 在超时后会被删除、没有设置超时时间的 Cookie（称作 Session Cookie）在浏览器关闭后就会⾃动删除；另外，服务器也可以主动删除还未过期的客户端 Cookies。</p>
<p><a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/1.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/1.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/1.jpg"></a></p>
<p><a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/2.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/2.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/2.jpg"></a></p>
<p><a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/3.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/3.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/3.jpg"></a></p>
<p><a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/4.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/4.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/4.jpg"></a></p>
<p><a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/5.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/5.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/5.jpg"></a></p>
<p><a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/6.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/6.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/6.jpg"></a></p>
</li>
</ol>
</li>
<li><p>Cookie 的作⽤</p>
<ul>
<li><p>会话管理：登录状态、购物⻋</p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/7.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/7.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/7.jpg"></a></p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/8.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/8.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/8.jpg"></a></p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/9.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/9.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/9.jpg"></a></p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/10.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/10.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/10.jpg"></a></p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/11.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/11.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/11.jpg"></a></p>
</li>
<li><p>个性化：⽤户偏好、主题</p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/8.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/12.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/12.jpg"></a></p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/13.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/13.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/13.jpg"></a></p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/14.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/14.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/14.jpg"></a></p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/15.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/15.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/15.jpg"></a></p>
</li>
<li><p>Tracking：分析⽤户⾏为</p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/16.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/16.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/16.jpg"></a></p>
</li>
</ul>
</li>
<li><p>XSS (Cross-site scripting)（了解即可）：跨站脚本攻击。即使⽤ JavaScript 拿到浏览器的 Cookie 之后，发送到⾃⼰的⽹站，以这种⽅式来盗取⽤户Cookie。应对⽅式： Server 在发送 Cookie 时，敏感的 Cookie 加上HttpOnly。</p>
<ul>
<li>应对⽅式： HttpOnly——这个 Cookie 只能⽤于 HTTP 请求，不能被JavaScript 调⽤。它可以防⽌本地代码滥⽤ Cookie。</li>
</ul>
</li>
<li><p>XSRF (Cross-site request forgery)（了解即可）：跨站请求伪造。即在⽤户不知情的情况下访问已经保存了 Cookie 的⽹站，以此来越权操作⽤户账户（例如盗取⽤户资⾦）。应对⽅式主要是从服务器安全⻆度考虑，就不多说了。</p>
<ul>
<li>应对⽅式： Referer 校验。</li>
</ul>
</li>
</ul>
<h2 id="Authorization"><a href="#Authorization" class="headerlink" title="Authorization"></a>Authorization</h2><p>两种主流⽅式： Basic 和 Bearer</p>
<h3 id="Basic："><a href="#Basic：" class="headerlink" title="Basic："></a>Basic：</h3><ul>
<li>格式： Authorization: Basic <a href="username:password(Base64ed)">username:password(Base64ed)</a></li>
</ul>
<h3 id="Bearer："><a href="#Bearer：" class="headerlink" title="Bearer："></a>Bearer：</h3><ul>
<li><p>格式： Authorization: Bearer <bearer token></p>
</li>
<li><p>bearer token 的获取⽅式：通过 OAuth2 的授权流程</p>
</li>
<li><p>OAuth2 的流程（下⾯的⽂字可以配合视频课程或者 PPT 中的图来看）：</p>
<ol start="0">
<li>第三⽅⽹站向授权⽅⽹站申请第三⽅授权合作，拿到 client id 和 client secret</li>
<li>⽤户在使⽤第三⽅⽹站时，点击「通过 XX (如 GitHub) 授权」按钮，第三⽅⽹站将⻚⾯跳转到授权⽅⽹站，并传⼊ client id 作为⾃⼰的身份标识</li>
<li>授权⽅⽹站根据 client id ，将第三⽅⽹站的信息和第三⽅⽹站需要的⽤户权限展示给⽤户，并询问⽤户是否同意授权</li>
<li>⽤户点击「同意授权」按钮后，授权⽅⽹站将⻚⾯跳转回第三⽅⽹站，并传⼊ Authorization code 作为⽤户认可的凭证</li>
<li>第三⽅⽹站将 Authorization code 发送回⾃⼰的服务器</li>
<li>服务器将 Authorization code 和⾃⼰的 client secret ⼀并发送给授权⽅的服务器，授权⽅服务器在验证通过后，返回 access token。 OAuth 流程结束</li>
<li>在上⾯的过程结束之后，第三⽅⽹站的服务器（或者有时客户端也会）就可以使⽤ access token 作为⽤户授权的令牌，向授权⽅⽹站发送请求来获取⽤户信息或操作⽤户账户。但这已经在 OAuth 流程之外。</li>
</ol>
</li>
<li><p>为什么 OAuth 要引⼊ Authorization code，并需要申请授权的第三⽅将Authorization code 发送回⾃⼰的服务器，再从服务器来获取 access token，⽽不是直接返回 access token ？这样复杂的流程意义何在？ 为了安全。 OAuth不强制授权流程必须使⽤ HTTPS，因此需要保证当通信路径中存在窃听者时，依然具有⾜够⾼的安全性。</p>
</li>
<li><p>第三⽅ App 通过微信登录的流程，也是⼀个 OAuth2 流程：</p>
<ol start="0">
<li>第三⽅ App 向腾讯申请第三⽅授权合作，拿到 client id 和 client secret</li>
<li>⽤户在使⽤第三⽅ App 时，点击「通过微信登录」，第三⽅ App 将使⽤微信 SDK 跳转到微信，并传⼊⾃⼰的 client id 作为⾃⼰的身份标识</li>
<li>微信通过和服务器交互，拿到第三⽅ App 的信息，并限制在界⾯中，然后询问⽤户是否同意授权该 App 使⽤微信来登录</li>
<li>⽤户点击「使⽤微信登录」后，微信和服务器交互将授权信息提交，然后跳转回第三⽅ App，并传⼊ Authorization code 作为⽤户认可的凭证</li>
<li>第三⽅ App 调⽤⾃⼰服务器的「微信登录」 Api，并传⼊ Authorizationcode，然后等待服务器的响应</li>
<li>服务器在收到登录请求后，拿收到的 Authorization code 去向微信的第三⽅授权接⼝发送请求，将 Authorization code 和⾃⼰的 client secret ⼀起作为参数发送，微信在验证通过后，返回 access token</li>
<li>服务器在收到 access token 后，⽴即拿着 access token 去向微信的⽤户信息接⼝发送请求，微信验证通过后，返回⽤户信息</li>
<li>服务器在收到⽤户信息后，在⾃⼰的数据库中为⽤户创建⼀个账户，并使⽤从微信服务器拿来的⽤户信息填⼊⾃⼰的数据库，以及将⽤户的 ID 和⽤户的微信 ID 做关联</li>
<li>⽤户创建完成后，服务器向客户端的请求发送响应，传送回刚创建好的⽤户信息</li>
<li>客户端收到服务器响应，⽤户登录成功</li>
</ol>
</li>
<li><p>在⾃家 App 中使⽤ Bearer token</p>
</li>
</ul>
<p>有的 App 会在 Api 的设计中，将登录和授权设计成类似 OAuth2 的过程，但简化掉 Authorization code 概念。即：登录接⼝请求成功时，会返回 access token，然后客户端在之后的请求中，就可以使⽤这个 access token 来当做 bearer token 进⾏⽤户操作了。</p>
<ul>
<li><p>Refresh token</p>
<p>  <a href="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/17.jpg" target="_blank" rel="noopener"><img src="https://gitee.com/zhangpingV5/BlogPic/raw/master/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E6%96%B9%E6%8E%88%E6%9D%83/17.jpg" alt="https://gitee.com/zhangpingV5/BlogPic/raw/master/登录和第三方授权/17.jpg"></a></p>
</li>
</ul>
<p>⽤法： access token 有失效时间，在它失效后，调⽤ refresh token 接⼝，传⼊refresh_token 来获取新的 access token。</p>
<p>⽬的：安全。当 access token 失窃，由于它有失效时间，因此坏⼈只有较短的时间来「做坏事」；同时，由于（在标准的 OAuth2 流程中） refresh token 永远只存在与第三⽅服务的服务器中，因此 refresh token ⼏乎没有失窃的⻛险。</p>

        </div>

        
            <section class="post-copyright">
                
                    <p class="copyright-item">
                        <span>Author:</span>
                        <span>ZhangPing</span>
                    </p>
                
                
                    <p class="copyright-item">
                        <span>Permalink:</span>
                        <span><a href="https://zhangpingv5.gitee.io/2021/01/15/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E2%BD%85%E6%8E%88%E6%9D%83/">https://zhangpingv5.gitee.io/2021/01/15/%E7%99%BB%E5%BD%95%E5%92%8C%E7%AC%AC%E4%B8%89%E2%BD%85%E6%8E%88%E6%9D%83/</a></span>
                    </p>
                
                
                    <p class="copyright-item">
                        <span>License:</span>
                        <span>转载请注明出处</span>
                    </p>
                
                
                     <p class="copyright-item">
                         <span>Slogan:</span>
                         <span>Self-descipline grants me freedom.</span>
                     </p>
                

            </section>
        
        <section class="post-tags">
            <div>
                <span>Tag(s):</span>
                <span class="tag">
                    
                    
                        <a href="/tags/%E7%AC%94%E8%AE%B0/"># 笔记</a>
                    
                        
                </span>
            </div>
            <div>
                <a href="javascript:window.history.back();">back</a>
                <span>· </span>
                <a href="/">home</a>
            </div>
        </section>
        <section class="post-nav">
            
                <a class="prev" rel="prev" href="/2021/02/17/kotlin%E5%9F%BA%E7%A1%80(%E4%B8%80)/">kotlin基础(一)</a>
            
            
            <a class="next" rel="next" href="/2021/01/13/Hash/">Hash</a>
            
        </section>


    </article>
</div>

        </div>
        <footer id="footer" class="footer">
    <div class="copyright">
        <span>© ZhangPing | Powered by <a href="https://hexo.io" target="_blank">Hexo</a> & <a href="https://github.com/Siricee/hexo-theme-Chic" target="_blank">Chic</a></span>
    </div>
</footer>

    </div>
</body>
</html>
